<template>
  <Layout ref="load" class="centre bg-f8">
    <Header :info="info"/>
    <CellCardGroup
      :items="cardList"
      :show-head="false"
      cols="2"
      @click="({link})=>$router.push(link)"
    />
  </Layout>
</template>

<script>
import Header from "./component/Header";
import CellCardGroup from "@/components/CellCardGroup";
export default {
  name: "centre",
  data() {
    return {
      info: {}
    };
  },
  computed: {
    cardList() {
      const items = [];
      const { operation } = this.info.jobs_info ? this.info.jobs_info : {};
      if (operation) {
        operation.forEach(e => {
          let obj = {};
          obj.text = e.module_name;
          switch (e.module_id) {
            case "1":
              obj.icon = "qr";
              obj.link = "/verify";
              break;
            case "4":
              obj.icon = "form";
              obj.link = "/order/list";
              break;
            case "5":
              obj.icon = "stock";
              obj.link = "/statistic";
              break;
            case "6":
              obj.icon = "manage";
              obj.link = "/manage/list";
              break;
          }
          items.push(obj);
        });
      }
      return items;
    }
  },
  mounted() {
    const $this = this;
    $this.$store
      .dispatch("getAccountInfo")
      .then(info => {
        $this.info = info;
        $this.$refs.load.success();
      })
      .catch(() => {
        $this.$refs.load.fail();
      });
  },
  components: {
    Header,
    CellCardGroup
  }
};
</script>
